import classnames from 'classnames';
import { View, Image, Text } from '@tarojs/components';
import css from './index.module.less';
import { zd, picture } from "./image.js";

export default function Card(props) {
    /**
     * state
     * -1: 已结束
     * 0: 未开始
     * 1: 报名中
     * 2: 进行中（三会一课）
     */
    const { text, date, school, image, state, isDingZhi } = props.info;
    // 是否有顶置
    return (
        <View className={css.card}>
            <View className={css.left}>
                <View className={css.title}>
                    <Text>{text.length > 8 ? `${text.slice(0, 8)}...` : text}</Text>
                    {isDingZhi ? <Image src={zd} /> : <></>}
                </View>
                <View className={css.footer}>
                    <Text className={css.text}>{date}</Text>
                    <Text className={css.text}>{school}</Text>
                </View>
            </View>
            <View className={css.right}>
                {
                    state === -1 ? <Text className={classnames(css.tip, css.end)}>已结束</Text> :
                        state === 0 ? <Text className={classnames(css.tip, css.no)}>未开始</Text> :
                            state === 1 ? <Text className={classnames(css.tip, css.ing)}>报名中</Text> :
                                state === 2 ? <Text className={classnames(css.tip, css.ing)}>进行中</Text> :
                                    <></>
                }
                {/* <Text className={classnames(css.tip, css.ing)}>{state}</Text> */}
                <Image src={image === undefined || image === null || image === '' ? picture : image} />
            </View>
        </View>
    );
}
